<template>
<div class="common" v-if="Object.keys(detaileCommoninfo).length !== 0">
  <div class="more">
    <div>用户评价</div>
    <a href="">
      <div  class="more-item">更多</div>
    </a>
  </div>

  <div class="user">
    <img :src="detaileCommoninfo.user.avatar" alt="">
    <div>{{detaileCommoninfo.user.uname}}</div>
  </div>
  <div class="content">{{detaileCommoninfo.content}}</div>
  <div class="created">{{detaileCommoninfo.created | showData}}</div>
  <div class="img-item" v-for="item in detaileCommoninfo.images">
    <img :src="item" alt="">
  </div>
  <div class="bottom"></div>
</div>
</template>

<script>
import {format} from '@/common/Utils/Utils'
export default {
  name: "detailCommoninfo",
  props:{
    detaileCommoninfo:{
      type:Object,
      default (){
        return {}
      }
    }
  },
  data () {
    return {
      avatar:null
    }
  },


  filters:{
    showData (valus) {
      return format(valus)
    }
  },
  methods:{
  }
}
</script>

<style scoped>
.common{
  position: relative;
  top:280px;

}
.more{
  font-size: 15px;
  display: flex;
  border-bottom: 1px whitesmoke solid;

}
.more div{
  padding: 0 10px;
}
.more-item{
position: relative;
right: 0;
}
.user{
  padding: 15px;
  display: flex;

  position: relative;

}
.user div{

margin: 15px 10px;
}
.user img{
  width: 50px;
}
.content{
  padding: 0 15px;
  font-size: 15px;
}
.created{
  font-size: 10px;
  opacity: 0.8;
  padding: 10px;
}
.img-item{
padding: 15px;
}
.img-item img{
  width: 80px;
}
.bottom{
  border-bottom: 5px whitesmoke solid;
  margin-top: 30px;
}
</style>